<template>
  <div>
    <el-descriptions
      class="margin-top"
      title="基本信息"
      :column="2"
      size="small"
      border
      v-if="id != null"
    >
      <el-descriptions-item label="登记物品">
        <template slot="label"><i class="el-icon-box" />登记物品</template>
        {{ form.itemCatalogName }}
      </el-descriptions-item>
      <el-descriptions-item label="资产编号">
        <template slot="label"><i class="el-icon-s-tools" /> 资产编号</template>
        {{ form.number }}
      </el-descriptions-item>
      <el-descriptions-item label="资产名称">
        <template slot="label"><i class="el-icon-box" /> 资产名称 </template>
        {{ form.assetName }}
      </el-descriptions-item>
      <el-descriptions-item label="型号">
        <template slot="label"><i class="el-icon-box" />型号</template>
        {{ form.model }}
      </el-descriptions-item>
      <el-descriptions-item label="单位">
        <template slot="label"><i class="el-icon-collection" />单位</template>
        {{ form.unit }}
      </el-descriptions-item>
      <el-descriptions-item label="供应商">
        <template slot="label"><i class="el-icon-truck" />供应商</template>
        {{ form.supplierName }}
      </el-descriptions-item>
      <el-descriptions-item label="品牌">
        <template slot="label"><i class="el-icon-collection" /> 品牌</template>
        {{ form.brand }}
      </el-descriptions-item>
      <el-descriptions-item label="资产分类">
        <template slot="label"
          ><i class="el-icon-collection" /> 资产分类</template
        >
        {{ form.assetCategoryName }}
      </el-descriptions-item>
      <el-descriptions-item label="资产来源">
        <template slot="label"
          ><i class="el-icon-collection" /> 资产来源</template
        >
        <el-tag v-if="form.source === 1" type="success">购入</el-tag>
        <el-tag v-else-if="form.source === 2" type="success">自建</el-tag>
        <el-tag v-else-if="form.source === 3" type="success">租赁</el-tag>
        <el-tag v-else-if="form.source === 4" type="success">捐赠</el-tag>
        <el-tag v-else-if="form.source === 5" type="success">盘盈</el-tag>
        <el-tag v-else-if="form.source === 6" type="success">其他</el-tag>
        <!-- {{ form.source }} -->
      </el-descriptions-item>
      <el-descriptions-item label="管理员">
        <template slot="label"><i class="el-icon-user-solid" />管理员</template>
        {{ form.adminName }}
      </el-descriptions-item>
      <el-descriptions-item label="使用人">
        <template slot="label"><i class="el-icon-user" />使用人</template>
        {{ form.userName }}
      </el-descriptions-item>
      <el-descriptions-item label="使用部门">
        <template slot="label"><i class="el-icon-s-grid" /> 使用部门</template>
        {{ form.departName }}
      </el-descriptions-item>
      <el-descriptions-item label="资产状态">
        <template slot="label"><i class="el-icon-s-check" />资产状态</template>
        <el-tag v-if="form.assetStatus === 1" type="success">闲置中</el-tag>
        <el-tag v-else-if="form.assetStatus === 2" type="warning"
          >使用中</el-tag
        >
        <el-tag v-else-if="form.assetStatus === 3" type="danger">借用中</el-tag>
        <el-tag v-else-if="form.assetStatus === 4" type="warning"
          >维修中</el-tag
        >
        <el-tag v-else-if="form.assetStatus === 5" type="danger">已报废</el-tag>
        <!-- {{ form.assetStatus }} -->
      </el-descriptions-item>
      <el-descriptions-item label="原存放位置">
        <template slot="label"
          ><i class="el-icon-location" /> 原存放位置</template
        >
        {{ form.nowLocationName }}
      </el-descriptions-item>
      <el-descriptions-item label="目标位置">
        <template slot="label"
          ><i class="el-icon-location" /> 目标位置</template
        >
        {{ form.targetLocationName }}
      </el-descriptions-item>
      <el-descriptions-item label="仓库">
        <template slot="label"><i class="el-icon-goods" /> 仓库</template>
        {{ form.storageName }}
      </el-descriptions-item>
      <el-descriptions-item label="用途">
        <template slot="label"><i class="el-icon-s-tools" /> 用途</template>
        {{ form.usage }}
      </el-descriptions-item>
      <el-descriptions-item label="购入金额">
        <template slot="label"><i class="el-icon-coin" /> 购入金额</template>
        {{ form.amount }}
      </el-descriptions-item>
      <el-descriptions-item label="出厂日期">
        <template slot="label"><i class="el-icon-date" /> 出厂日期</template>
        <el-date-picker
          v-model="form.factoryDate"
          type="date"
          disabled
          style="width: 40%"
        />
      </el-descriptions-item>
      <el-descriptions-item label="启用日期">
        <template slot="label"><i class="el-icon-date" /> 启用日期</template>
        <el-date-picker
          v-if="form.startDate != null"
          v-model="form.startDate"
          type="date"
          disabled
          style="width: 40%"
        />
      </el-descriptions-item>
      <el-descriptions-item label="入账状态">
        <template slot="label"><i class="el-icon-coin" /> 入账状态</template>
        <el-tag v-if="form.accountStatus === 1" type="danger">未入账</el-tag>
        <el-tag v-else-if="form.accountStatus === 2" type="success"
          >已入账</el-tag
        >
        <!-- {{ form.accountStatus }} -->
      </el-descriptions-item>
    </el-descriptions>
  </div>
</template>

<script>
import { fixedAsset } from "@/api/fixedAsset";
export default {
  props: ["id"],
  data() {
    return {
      form: {
        itemCatalogName: "",
        number: "",
        assetName: "",
        model: "",
        unit: "",
        supplierName: "",
        brand: "",
        assetCategoryName: "",
        source: "",
        adminName: "",
        userName: "",
        departName: "",
        assetStatus: "",
        nowLocationName: "",
        targetLocationName: "",
        storageName: "",
        usage: "",
        amount: "",
        factoryDate: "",
        startDate: "",
        accountStatus: "",
      },
    };
  },
  created() {
    this.getBasicFixedAsset();
  },
  methods: {
    getBasicFixedAsset() {
      fixedAsset.findBasic(this.id).then((res) => {
        this.form = res.data;
      });
    },
  },
};
</script>

<style scoped></style>
